<script>
import MyFooter from './components/MyFooter.vue'
export default {
  name: 'App',
  components: {
    MyFooter
  }
}
</script>
<template>
  <router-view class="container"></router-view>
  <MyFooter></MyFooter>
</template>

<style scoped>
.active {
  color: red;
  background-color: yellow;
}

/* 穿透样式怎么写 */
.container {
  display: flex;
  flex-direction: column;

}

.container :deep(header) {
  height: 44px;
  background-color: teal;
  text-align: center;
  line-height: 44px;
}

.container :deep(main) {
  flex: 1;
  overflow-y: auto;
  background-color: honeydew;
}
</style>
